{{extend 'layout.html'}}
<style type="text/css">
li.edititem {
    width:100%;
    /*background-color:LightYellow;*/
    margin-bottom:1em;
    }
ul.edititem {
    list-style-type:none;
    margin-bottom:2em;
    width:90%;
    }
table.edititem {
    width: 100%;
    }
table.synonym {
    width: 60% !important;
}
.synonym input {
    width: 15em !important;
}
</style>          

<script type="text/javascript" src="{{=URL(request.application,'static','ckeditor/ckeditor.js')}}"></script>
<div id=pagehelpcontent class=hidden>
<h3><strong>{{=T("Page Help")}}</strong></h3>
<p>{{=T("Describe your new problem using the rich text editor below. By convention, the label applied to your problem will be taken from the first line, so it's helpful to think of a good short title. You can provide as much or as little extra description as seems needed to make the problem clear to the people who will be collaborating with you. You don't have to get it perfect immediately; you'll have a chance to edit the text later.")}}</p>

<p>{{=T("Beneath the editor, is a table where you can control some of the terminology PeerTool with use in the Edit, Respond, and Results pages.")}}</p>

<p>{{=T("If you decide you want to cancel creating the problem, you can click any of the buttons in the main menu to go to another page without clicking Submit.")}}</p>

<h3><strong>Editor Features</strong></h3>
<p>{{=T("The editor behaves much like a normal, albeit limited, word processor. You can format bold or italic text and make numbered or bulleted lists. You can also insert links to external web pages and images using the buttons provided.  The rightmost button, the one with the magnifying glass, allows you to see a more accurate preview of how your text will look. Clicking it will open a new tab or window in your browser. Remember to return to the original window to click Submit when you're satisfied with your description.")}}</p>  

<p>{{=T("You can also also use the Source button to view and edit the HTML markup for your description. For security reasons, only a small set of safe HTML tags are supported; others will be escaped when you click Submit.  We do support the object and embed tags sufficiently to allow you to embed video clips from YouTube or Vimeo.")}}</p>
</div>

<ul class=edititem>
<li class=edititem><h1>{{=title}}</h1></li>
{{form['_class'] = 'synonym'}}
{{=form.custom.begin}}
{{
fcw = form.custom.widget
textarea = form.custom.widget.description
textarea_id = textarea['_id']
}}
<li class=edititem>
{{=DIV(textarea)}}
</li>
<script type="text/javascript">
    CKEDITOR.replace('{{=textarea_id}}', {
            toolbar : 'Basic'
        });
</script> 
<li>&nbsp;</li>
<li>{{=T("If you wish, you can use the table below to change the terminology PeerTool will use to label this problem, its solutions and criteria. You might, for instance, prefer to call them 'challenges, options, and values'. Choose whatever fits your context. Be sure to provide singular and plural versions." )}}</li>
<li>&nbsp;</li>
{{
rows = []
for i,k in enumerate("problem problems solution "\
    "solutions criterion "\
    "criteria".split(' ')):
    if i%2 == 0:
        col = [k]
    else:
        col.append(k)
        rows.append(col)
        pass
    pass
    
}}
<li><table class="synonym">
{{=TR(TH(T("Default")),TH(T("Singular")), TH(T("Plural")))}}
{{
for r in rows:
    =TR(TD(r[0]), TD(fcw[r[0]]), TD(fcw[r[1]]))
    pass
}}
</table></li>
<li class=edititem>{{=form.custom.submit}}</li>
{{=form.custom.end}}
</ul>
